<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <button class="btn">计算</button>
  <input type="text" id="num" placeholder="输入天数" value="40"/>
<script>
  /* 
  1 1 2 3 5
  f(n) = f(n-1) + f(n-2)
  */
  

  document.querySelector('button').onclick = function () {
    const num = document.getElementById('num').value*1
    // 创建worker, 加载分线程的JS代码
    const worker = new Worker('./10_worker.js', {
      type: 'module', // 加载的分线程模板中支持模块化的语法(可以用import)
    })
    // 向分线程发送消息, 携带num
    console.log('主线程向分线程发送消息')
    worker.postMessage(num)
    // 绑定接收消息的监听
    worker.onmessage = (event) => {
      //取出分线程发送过来的数据
      const result = event.data
      console.log('主线程接收到分线程发过来的数据', result)
      alert(result)
    }
  }
</script>
</body>
</html>